<template>
  <div class="search-bar">
    <el-form :inline="true" :model="formItem" class="form-filter" size="mini">
      <el-form-item>
        <TreeSelect
          v-if="assetTypeCode===null"
          v-model="formItem.s_assetTypeCode"
          :multiple="false"
          :options="typeOptions"
          placeholder="选择资产分类"
          @input="onAssetTypeInput"
        />
      </el-form-item>
      <el-form-item>
        <el-input
          v-model="formItem.s_name"
          clearable
          placeholder="请输入产品名..."
          @keyup.enter.native="search"
          @change="onGlobeSearchInputChange"
        />
      </el-form-item>
      <el-form-item>
        <el-button plain icon="el-icon-search" @click="search" />
        <!-- <el-button plain icon="el-icon-search" @click="search">查询</el-button>
        <el-button plain icon="el-icon-refresh-left" @click="reset">重置</el-button> -->
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import {
  tree
} from '@neu/dcam-ui/api/assetType'
import TreeSelect from '@neu/biz-core/components/TreeSelect'
// 定义一个查询表单原始项
const formItem = {
  s_name: '',
  s_assetTypeCode: null
}

export default {
  name: 'ProductTableFilter',
  components: {
    TreeSelect
  },
  props: {
    forSelection: {
      type: Boolean,
      default: false,
      required: false
    },
    assetTypeCode: {
      type: String,
      default: null,
      required: false
    }
  },
  data() {
    return {
      formItem: {
        ...formItem
      },
      /** 资产类型树 */
      typeOptions: []
    }
  },
  created() {
    this.tree()
    this.formItem.s_assetTypeCode = this.assetTypeCode
    this.search()
  },
  methods: {
    // 类型树
    tree() {
      tree().then(response => {
        this.typeOptions = response.data
      })
    },
    // 查询按钮点击事件处理
    search: function() {
      this.$parent.filter(this.formItem)
    },
    // 重置按钮点击事件处理
    reset: function() {
      this.formItem = {
        ...formItem
      }
      this.search()
    },
    onChange: function(val) {
      this.$parent.onResize()
    },
    onAssetTypeInput(value) {
      this.search()
    },
    onGlobeSearchInputChange(value) {
      if (value === '') {
        this.search()
      }
    }
  }
}
</script>
